<template>
  <CustomScroller class="absolute-full">
    <CommonForm class="q-pa-lg" :form="form" :value="$data" :input-params="inputParams" auto-save />
  </CustomScroller>
</template>

<script>
// 【参数配置对话框】
import Vue from 'vue'
import { mapStateRW } from 'boot/utils'

const CFG_PROPS = ['hitTime', 'hideTime', 'winHints']

export default {
  data: vm => ({
    ...vm.$mapProps(CFG_PROPS, 'm_', Vue.store.state.main),
    form: {
      m_hitTime: { label: '准点击中时间：', min: 1, max: 1000, suffix: '秒' },
      m_hideTime: { label: '隐藏显示时间：', min: 0, max: 1000, suffix: '秒' },
      m_winHints: {
        label: '偏差胜利信息：',
        t: 'text',
        labelClass: 'self-start q-mt-sm',
        qInputClass: 'q-space',
        autogrow: true,
        placeholder: '格式为：{ "最大偏差（加符号表示分正负）": "胜利信息", ... }'
      }
    },
    inputParams: { t: 'num', outlined: true, labelWidth: 100 }
  }),

  computed: {
    ...mapStateRW('main', CFG_PROPS)
  },

  methods: {
    onOk() {
      if (typeof this.m_winHints === 'string') {
        try {
          this.m_winHints = JSON.parse(this.m_winHints)
        } catch (e) {
          this.$showMsg('误差胜利信息格式错误，请检查！<br><br>正确' + this.form.m_winHints.placeholder)
          return false
        }
      }
      this.$syncProps(CFG_PROPS, this, 'm_')
    }
  }
}
</script>
